﻿
@{
    ViewData["Title"] = "菜单列表";
    Layout = "~/Views/Shared/_List.cshtml";
}

<div class="kit-table">
    <div id="toolbar" class="kit-table-header">
        <div class="layui-btn-group lonewolf-btns">
        </div>
        <div class="kit-search-inputs">
            <div class="kit-search-keyword">
                <input type="text" class="layui-input" name="keyword" id="keyword" placeholder="搜索关键字.." />
                <button href="javascript:;" onclick="initGrid()"><i class="layui-icon">&#xe615;</i></button>
            </div>
        </div>
    </div>
    <div class="kit-table-body">
        <table class="layui-table" lay-data="{height:'full-49', url:'/Menu/GetPages',method:'post', page:true, id:'TableList'}" lay-filter="demo">
            <thead>
                <tr>
                    <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
                    <th lay-data="{field:'menuName', sort: true}">菜单名称</th>
                    <th lay-data="{field:'menuIcon', width:180, sort: true,toolbar: '#ModIcon'}">菜单图标</th>
                    <th lay-data="{field:'menuLevel', width:180, sort: true}">菜单层级</th>
                    <th lay-data="{field:'menuIsUse', width:180,toolbar: '#isUse'}">状态</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
<script type="text/html" id="ModIcon">
    <i class="{{d.menuIcon}}"></i>
    <span>( {{d.menuIcon}} )</span>
</script>
<script type="text/html" id="isUse">
    {{#  if(d.menuIsUse == true){ }}
    <span style="color: #01AAED;">启用</span>
    {{#  } else { }}
    <span style="color: #F581B1;">禁用</span>
    {{#  } }}
</script>
<script>
    var table;
    var $;
    layui.use(['table'], function () {
        $ = layui.jquery;
        var form = layui.form;
        table = layui.table;
        $("#toolbar").authorizeButton();
    });
    //数据绑定
    function initGrid() {
        table.reload('TableList', {
            method: 'post',
            where: { //设定异步数据接口的额外参数，任意设
                key: $('#keyword').val()
            }
            , page: {
                curr: 1 //重新从第 1 页开始
            }
        });
    }
    //删除操作
    function btn_delete(a) {
        var checkStatus = table.checkStatus('TableList');
        var data = checkStatus.data;
        if (data.length < 1) {
            $.layerMsg("请勾选需要删除的数据。", "warning");
            return;
        }
        $.layerConfirm({
            content: "您已选中" + data.length + "条数据, 确定删除吗？",
            callback: function () {
                var list = [];
                for (var i = 0; i < data.length; i++) {
                    list[i] = data[i]["Id"];
                }
                $.formSubmit({
                    url: a,
                    data: { primaryKey: list.join() },
                    success: function () {
                        initGrid();
                    }
                });
            }
        });
    }
</script>

